<template>
  <div class="main">
    <div>
      <fcTable
        ref="table"
        :columes="columes"
        :selection="false"
        :url="this.list"
        :deletUrl="universalUrl"
      >
        <!-- 表上头按钮插槽 -->
        <template v-slot:button>
          <el-button
            icon="el-icon-circle-plus-outline"
            type="primary"
            v-hasPermi="['system']"
            @click="add()"
          >新增
          </el-button
          >
          <el-button
            icon="el-icon-circle-plus-outline"
            type="primary"
            v-hasPermi="['system']"
            @click="importExcel"
          >导出
          </el-button
          >
        </template>

        <!-- 表格行插槽 -->
        <template #inOutflag="scope">
          <el-tag :type="scope.row.inOutFlag == 0 ? 'primary' : 'warning'">{{
            scope.row.inOutFlagText
            }}
          </el-tag>
        </template>
        <template #sysCreateUser="scope">
          <el-tag type="primary">{{ scope.row.sysCreateUser }}</el-tag>
        </template>
        <template #operation="scope">
          <el-link type="primary" style="margin-right: 5px" @click="edit(scope.row)">编辑</el-link>
        </template>
      </fcTable>
    </div>
    <billTypeAdd
      ref="editAndAdd"
      :title="title"
      :visible.sync="visible"
      :item="element"
      @Ok="addAndEdit"
    ></billTypeAdd>
  </div>
</template>
<script>
  import request from "@/utils/request";
  import fcTable from "@/components/futureCloudMOM/fcTable";
  import billTypeAdd from "./billTypeAdd";

  export default {
    name: "BasicBillType",
    components: {
      fcTable,
      billTypeAdd,
    },
    data() {
      return {
        columes: [
          {
            label: "订单类型",
            key: "billType",
            showOverflowTooltip: true,
            visible: true,
          },
          {
            label: "出入库标识",
            key: "inOutflag",
            visible: true,
            type: "slot",
            //后端通过注解翻译过来的字段
            dictText: "inOutflagText",
            //传入字典编码 用于条件搜索时传入字典对应的值
            dictCode: "basic_billtype",
          },
          {
            label: "创建时间",
            key: "sysCreateTime",
            visible: true,
            sortable: true,
          },
          {
            label: "操作",
            key: "operation",
            delete: true,
            //插槽需要的属性
            type: "slot",
            //element-ui自带的属性 参考文档写 都可用
            fixed: "right",
            //显隐列需要的属性
            visible: true,
            disabled: true,
            search: true,
          },
        ],
        //新增/编辑弹窗打开的标题
        title: "",
        //显隐
        visible: false,
        //数据
        element: {},
        //列表页
        list: "basic/bill_type/getList",
        //新增 修改 删除
        universalUrl: "basic/bill_type",
        // 数据导出
        importExcelUrl:"basic/bill_type/importExcel"
      };
    },

    methods: {
      open(item) {
        alert("数据:" + JSON.stringify(item));
      },
      add() {
        this.element = null;
        this.title = "新增";
        this.visible = true;
      },
      edit(item) {
        console.log(item);
        this.element = item;
        this.title = "编辑";
        this.visible = true;
      },
      addAndEdit(item) {
        console.log(item);
        let method = "put";
        if (this.title === "新增") {
          method = "post";
        }
        request({
          url: this.universalUrl,
          method: method,
          data: item,
        }).then((res) => {
          if (res.code === 200) {
            this.$message.success("操作成功");
            this.$refs.table.getList();
            this.$refs.editAndAdd.close();
          } else {
            this.$message.error(res.message);
          }
        });
      },

      // 数据导出
      importExcel(){
        this.download("basic/bill_type/importExcel");
      }
    },
  };
</script>
<style scoped>
  .main {
  }
</style>
